/**
 * 修改用户的基本信息 只能 昵称与邮箱地址
 * 1. 先要将被修改的数据写入到对象输入框中
 * 1.1 操作dom
 * 1.2 使用layui内置的方法  layui.form.val(要写入的表单，要写入的数据)
 * layui.form.val(要写入的表单，要写入的数据) 只要我们表单里面的input标签里面的 name属性值 与 要写入的数据里面的key值一样
 * 给表单提供  lay-filter="要写入的表单"
 */

var form = layui.form
form.verify({
  nickname: function (value) {
    if (value.length > 6) {
      return '昵称长度必须在 1 ~ 6 个字符之间！'
    }
  }
})

// 将用户的数据写入到输入框中
function getUserInfo() {
  $.ajax({
    method: 'GET',
    url: '/my/userinfo',
    // headers 就是请求头配置对象
    success: function (res) {
      if (res.status !== 0) {
        return layui.layer.msg('获取用户信息失败！')
      }
      console.log(res.data)
      // 使用 form.val 方法快速为表单赋值
      layui.form.val('userInfo', res.data)
    }
  })
}

getUserInfo()

/**
 * 完成修改用户信息的功能
 * 1. 需要给表单注册submit事件 阻止表单的默认行为
 * 2. 需要收集到 表单的数据
 * 3. 查阅接口文档 关注请求方式与请求参数 还有请求的类型
 * 4. 发送ajax
 * 5. 接收服务器响应回来的数据
 * 6. 判断是否修改成功 如果失败就需要提示用户
 * 7. 如果成功 需要更新页面上面的数据
 */

$('#editForm').on('submit', function (e) {
  e.preventDefault()
  const data = $(this).serialize()
  $.ajax({
    type: 'post',
    url: '/my/userinfo',
    data,
    success: (res) => {
      const { status, message } = res
      if (status !== 0) layui.layer.msg(message)
      // 表示用户的数据已经更新成功
      // 在子页面里面 想要更新父页面上面的数据  window.parent
      layui.layer.msg('修改成功')
      window.parent.getUserInfo()
    }
  })
})

// 1. 给按钮注册click事件
// 2. 阻止表单的默认行为 重置按钮 默认行为  清空表单里面的内容
// 3. 调用 getUserInfo方法
$('#reset').on('click', function (e) {
  e.preventDefault()
  getUserInfo()
})
